import { DatePicker, Input, InputNumber, Select } from '@/components/AntdProxy';
import CommonDrawer from '@/components/CommonDrawer';
import { CrudFormLayout } from '@/components/Crud';
import { GroupTreeSelect, LineSelect } from '@/components/CustomForm';
import { LEVEL_OPTIONS } from '@/constants/enums';
import { REQUIRED } from '@/constants/rules';
import useMaterial from '@/hooks/useMaterial';
import request from '@/utils/request';
import { useAsyncEffect } from 'ahooks';
import { Form, message } from 'antd';
import dayjs from 'dayjs';

export const BOOLEAN_OPTIONS = [
  { label: '是', value: 1 },
  { label: '否', value: 0 },
];
export const AUTO_TRIP_OPTIONS = [
  { label: '自动', value: 0 },
  { label: '手动', value: 1 },
];
const Save = (props) => {
  const { open, record, onCancel, onOk } = props;
  const [form] = Form.useForm();
  const { materialTypeOptions } = useMaterial();
  useAsyncEffect(() => {
    if (open && record) {
      form.setFieldsValue({
        ...record,
        day: record.day ? dayjs(record.day) : undefined,
      });
    }
  }, [open, record]);

  const handleOk = async () => {
    const values = await form.validateFields();
    console.log('values', values);
    const url = record ? '/datas/line/plan/update' : '/datas/line/plan/add';
    const params = {
      ...values,
      day: values.day ? dayjs(values.day).format('YYYY-MM-DD') : '',
    };
    if (record) {
      params.linePlanId = record?.linePlanId;
    }
    await request({
      url,
      method: 'POST',
      data: params,
    });
    message.success('操作成功');
    onOk?.();
  };

  return (
    <CommonDrawer
      title={record ? '编辑' : '新建'}
      open={open}
      onClose={onCancel}
      onOk={handleOk}
      afterOpenChange={(visible) => {
        if (!visible) {
          form.resetFields();
        }
      }}
      width={800}
      destroyOnHidden
    >
      <Form form={form} layout="vertical">
        <CrudFormLayout itemMinWidth={250}>
          <Form.Item label="线路" name="lineId" rules={[REQUIRED]}>
            <LineSelect
              onChange={(_val, _option) => {
                form.setFieldsValue({
                  type: _option?.type,
                });
              }}
            />
          </Form.Item>
          <Form.Item
            label="物料类型"
            name="type"
            rules={[REQUIRED]}
            initialValue={0}
          >
            <Select disabled options={materialTypeOptions} />
          </Form.Item>
          <Form.Item
            label="日期"
            name="day"
            rules={[REQUIRED]}
            initialValue={dayjs().add(1, 'day')}
          >
            <DatePicker placeholder="请选择日期" />
          </Form.Item>
          <Form.Item
            label="计划车数"
            name="total"
            rules={[REQUIRED]}
            initialValue={1}
          >
            <InputNumber min={0} />
          </Form.Item>
          <Form.Item label="客户业务" name="fixed" initialValue={1}>
            <Select options={BOOLEAN_OPTIONS} />
          </Form.Item>
          <Form.Item label="自动派单" name="autoTrip" initialValue={0}>
            <Select options={AUTO_TRIP_OPTIONS} />
          </Form.Item>
          <Form.Item label="级别" name="level" initialValue={1}>
            <Select options={LEVEL_OPTIONS} />
          </Form.Item>
          <Form.Item label="优先派单" name="firstTrip" initialValue={0}>
            <Select options={BOOLEAN_OPTIONS} />
          </Form.Item>
          <Form.Item label="组织" name="groups" rules={[REQUIRED]}>
            <GroupTreeSelect treeCheckable />
          </Form.Item>
          <Form.Item label="回货线路" name="backhauls">
            <LineSelect
              mode="multiple"
              optionsFilter={(options) =>
                options.filter((item) => item.lineType === 1)
              }
            />
          </Form.Item>
        </CrudFormLayout>
        <Form.Item label="备注" name="remark">
          <Input.TextArea maxLength={150} />
        </Form.Item>
      </Form>
    </CommonDrawer>
  );
};

export default Save;
